<template>
 <div>
   <div class="head">
    <el-row>
      <el-col :span="12" >
      <!-- <el-input v-model="input" placeholder="请输入内容"></el-input> -->
      </el-col>
        <el-col :span="10" :offset="0">
        <!-- <el-button type="primary" icon="el-icon-search" @click="scarch">搜索</el-button> -->
          <el-button type="primary" icon=" el-icon-plus" @click="add">添加</el-button>  
      </el-col>
    </el-row>
   </div>
   <el-table :data="list" style="width: 100%">

     <el-table-column prop="reid"  label="序号"  width="120"></el-table-column>
     <el-table-column prop="reason"  label="举报理由" show-overflow-tooltip  width="120"></el-table-column>
     <el-table-column prop="re_type" label="举报内容"  width="120"></el-table-column>
     <el-table-column prop="fid"  label="犯规类型"  width="120"></el-table-column>
     <el-table-column   label="是否处理"  width="120">
        <template slot-scope="scope">
　　　　 　<span v-if="scope.row.state=== '0'">未处理</span>
　　　　 　<span v-if="scope.row.state=== '1'">已处理</span>
　　　　</template>
     </el-table-column>
     <el-table-column prop="fe_time" label="举报时间" show-overflow-tooltip  width="200"></el-table-column>
    <el-table-column label="操作">
      <template slot-scope="scope">
        <el-button size="mini"  @click="edit(scope.row)">编辑</el-button>
        <el-button size="mini" type="danger"  @click="handleDelete(scope.row.fid)" >删除</el-button>
         <!-- <el-button size="mini" type="success" :disabled ="scope.row.state == 0?true:false"  @click="handleDelete(0)">启用</el-button>
         <el-button size="mini" type="danger" :disabled ="scope.row.state == 1?true:false"  @click="handleDelete(1)">禁用</el-button> -->
      </template>
    </el-table-column>
  </el-table>
    <!-- <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :page-count="pageInfo.pages"
      :current-page="pageNum"
      :page-sizes="limits"
      :page-size="pageSize"
      layout="total,sizes, prev, pager, next"
      >
    </el-pagination> -->
    <!-- 表单 -->
    <el-dialog title="收货地址" :visible.sync="dialogFormVisible">
    <el-form :model="form">
      <el-form-item label="序号" :label-width="formLabelWidth">
        <el-input hidden v-model="form.fid" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="犯规类型" :label-width="formLabelWidth">
        <el-input v-model="form.fname" autocomplete="off"></el-input>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="dialogFormVisible = false">取 消</el-button>
      <el-button type="primary" @click="submit()">确 定</el-button>
    </div>
  </el-dialog>
 </div>
</template>

<script>
  export default {
    
    data() {
      return {
        list:[],
        form: {},
        dialogFormVisible:false,
        input:'',
        formLabelWidth: '120px',
        // limits:[2, 4, 6, 8],
        // pageSize:2,// limits 的第几条
        // pageNum:1,// 第几页
        action:''
       
      }
    },
    created(){
     
      this.scarch();
    },
    methods: {
      
      submit(){
        this.dialogFormVisible=false;
        this.$http.post(this.action,{params:{...this.form}}).then(res=>{
          alert(res)
           if(res){
              this.$message("提交成功")
               this.scarch();
           }
        })
        
        
      },
      add(){
        this.dialogFormVisible=true;
        this.form={};
        this.action="/report/add"
      },

      edit(row) {
        this.dialogFormVisible=true;
        this.form=row;
        this.action="/report/update"
      },
      // 禁用 启用
      handleDelete(row) {
        
      this.$http.get('/report/del',{params:{cc:row.id}}).then(res=>{
        if(res.data==1){
          this.$message("删除成功")
          this.scarch();
        }
      })
      },scarch(){
         this.$http.post('/report/SelectAll').then(res=>{
          this.list=res
          
        })
      }
      
    }
  }
</script>
<style scoped>
 .head{
   padding: 10px 5px;
 }
</style>
